<template>
  <el-carousel indicator-position="outside">
    <el-carousel-item v-for="(item, index) in imgUrl" :key="index">
      <el-image :src="imgUrl[index]" class="img"/>
    </el-carousel-item>
  </el-carousel>
</template>

<script setup>
import {ref} from "vue";

const imgUrl = ref(["http://qiniuyun.linter.top/Linter/Vue_img/Home/LunBo/%E8%BD%AE%E6%92%AD%E5%9B%BE-1.png",
                          "http://qiniuyun.linter.top/Linter/Vue_img/Home/LunBo/%E8%BD%AE%E6%92%AD%E5%9B%BE-2.png",
                          "http://qiniuyun.linter.top/Linter/Vue_img/Home/LunBo/%E8%BD%AE%E6%92%AD%E5%9B%BE-3.png",
                          "http://qiniuyun.linter.top/Linter/Vue_img/Home/LunBo/%E8%BD%AE%E6%92%AD%E5%9B%BE-4.png"
])

</script>

<style scoped>
.img{
  border-radius: 10px;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
</style>
